<script setup lang="ts">
import useConfigStore from '../../../store/config'

const configStore = useConfigStore()

function toggleMode(v: boolean) {
  const html = document.querySelector('html')!
  html.style.filter = `grayscale(${Number(v)})`
  configStore.setGreyMode(v)
}

</script>

<template>
  <ElSwitch
    :model-value="configStore.getIsGreyMode"
    inline-prompt
    @change="toggleMode"
  />
</template>
